<template>
    <div style="background: rgb(254,254,254);padding-top: 59px;">
        <div class="w centerauto mtb_large">
            <div class="panel">
                <p class="item_title">选择一个符合您需求的应用类型</p>
                <div class="padding_16" style="min-height: 597px;">
                    <div class="apps_box">
                        <div :class="['app_item',(active == index) ? 'selected':'' ]" v-for="(item,index) in typeData" :key="index" @click="changetype(index,item.st_name,item.st_id)">
                            <div class="app_icon"><img :src="(active == index) ? item.st_photo_back : item.st_photo_just" alt=""></div>
                            <span class="app_name">{{item.st_name}}</span>
                        </div>
                    </div>
                    <div class="mt_large text-center">
                        <el-button type="primary" @click="goedit">下一步，快速完善需求信息</el-button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    
    import '../../assets/css/main.css'
    import '../../assets/css/projects.css'
    export default {
        data(){
            return{
                typeData: [],
                active: 0,
                name: '',
                typeid: '',
            }
        },
        methods: {
            init(){
                var _this = this;
                // 用户信息
                this.$httpGet('/api/index/Skilltype/getSkillForStatus',{'st_type': 1}).then(response => {

                    if(response.code == 200){

                        _this.typeData = response.msg;
                        _this.name = response.msg[0].st_name;
                        _this.typeid = response.msg[0].st_id;
                        
                    }

                });
            },
            changetype(ind,name,st_id){
                this.active = ind;
                this.name = name;
                this.typeid = st_id;
            },
            //去完善下一步
            goedit(){
                
                var _this = this;
                this.$router.push({
                    'path': '/publishedit',
                    'query': {'name': _this.name,'id': _this.typeid}
                })
            },
        },
        mounted(){
            this.init();
        },
    }
</script>